import { useRequest } from 'ahooks'
import { Button, Drawer, Space } from 'antd'
import { useCallback, useRef } from 'react'
import { getAdminDetailApi } from '../../../api/auth'
import AdminForm from '../AdminForm'

const UpdateAdminDrawer = (props) => {
  const formIns = useRef()
  const { visible, showModel, adminname } = props
  // 获取detail数据并导入form中
  const { data } = useRequest(() => getAdminDetailApi(adminname), { refreshDeps: [adminname], ready: adminname })
  const detail = data?.[0]
  // console.log(detail)
  const handleOk = useCallback(async () => {
    const verify = await formIns.current.submit()
    if (verify) showModel(false, true)
  }, [visible])
  const handleCancel = useCallback(() => {
    showModel()
  }, [visible])
  return (
    <>
      <Drawer
        title="编辑管理员"
        visible={visible}
        onClose={handleCancel}
        extra={(
          <Space>
            <Button onClick={handleCancel}>
              Cancel
            </Button>
            <Button type="primary" onClick={handleOk}>
              OK
            </Button>
          </Space>
        )}
      >
        <AdminForm ref={formIns} detail={detail} />
      </Drawer>
      <span />
    </>
  )
}
export default UpdateAdminDrawer
